/**
* 基础菜单 app设计管理
*/
<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>app设计</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 搜索筛选 -->
    <el-form :inline="true" class="user-search">
      <el-form-item>
      </el-form-item>
    </el-form>
    <!--列表-->
    <el-table size="small" :data="designs" highlight-current-row v-loading="loading" border element-loading-text="拼命加载中"
      style="width: 100%;">
      <el-table-column align="center" type="selection" width="60">
      </el-table-column>
      <el-table-column sortable prop="productName" label="产品名称" width="150">
      </el-table-column>
      <el-table-column sortable prop="cateName" label="品类" width="100">
      </el-table-column>
      <el-table-column sortable prop="state" label="发布状态" width="100">
        <template slot-scope="scope">
          <div>{{scope.row.state?"已发布":"未发布"}}</div>
        </template>
      </el-table-column>
      <el-table-column sortable prop="createAt" label="修改时间" width="150">
        <template slot-scope="scope">
          <div>{{scope.row.modifyAt|timestampToTime}}</div>
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作" min-width="100">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑设计</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页组件 -->
    <Pagination v-bind:child-msg="pageparm" @callFather="callFather"></Pagination>

  </div>
</template>

<script>
  import {
    DesignList,
  } from '../../api/appApi.js'
  import Pagination from '../../components/Pagination'
  export default {
    data() {
      return {
        loading: false, //是显示加载
        // rules表单验证
        rules: {},
        // 分页参数
        pageparm: {
          currentPage: 1,
          pageSize: 10,
          total: 10
        },
        designs: [],
      }
    },
    // 注册组件
    components: {
      Pagination,
    },
    /**
     * 数据发生改变
     */

    /**
     * 创建完毕
     */
    created() {
      this.getdata()
    },

    /**
     * 里面的方法只有被调用才会执行
     */
    methods: {
      getdata(parameter) {
        this.loading = true
        DesignList(parameter).then((res => {
          this.designs = res.data;
          this.loading = false;
        }))
      },
      // 分页插件事件
      callFather(parm) {
        this.formInline.page = parm.currentPage
        this.formInline.limit = parm.pageSize
        this.getdata()
      },
      handleEdit(index, row) {
        this.$router.push({
          path: '/app/DesignDetail',
          query: {
            id: row.id || '',
            productKey: row.productKey
          }
        })
      }
    }
  }
</script>
